<template>
	<a-row type="flex" class="h-screen overflow-y-auto">
		<a-col class="hidden p-16 lg:flex lg:w-2/3">
			<div class="items-center justify-center w-full px-16 lg:flex">
				<img :src="sideImg" alt="Login" class="mx-w-full" />
			</div>
		</a-col>
		<a-col class="flex items-center justify-center w-full p-16 mx-auto bg-white lg:w-1/3" >
			<a-col :sm="16" :md="12" :lg="24" class="px-6">
				<a-typography-title :level="2">欢迎访问 PP-ADMIN 👏</a-typography-title>
				<a-form class="loginForm" layout="vertical">
					<a-form-item label="邮箱">
						<a-input
							placeholder="邮箱"
							v-model:value="email"
						></a-input>
					</a-form-item>
					<a-form-item label="密码">
						<a-input
							v-model:value="password"
							type="password"
							placeholder="密码"
						></a-input>
					</a-form-item>
					<a-button block type="primary">登 录</a-button>
				</a-form>
			</a-col>
		</a-col>
	</a-row>
</template>

<script lang="ts" setup>
import { useLoginStore } from '@/store/module/login'
import { computed, ref } from 'vue'
import sideImg from '@assets/iamges/pages/login-v2.svg'
console.log(import.meta.env.VITE_APP_TITLE)

const store = useLoginStore()

const password = ref<string>('admin')
const email = ref<string>('admin@qq.com')
</script>

<style>
</style>